<template>
    <div>
      <login-top>
        <div slot="leftTop"></div>
        <div slot="middleTop">注册哔哩哔哩</div>
        <div slot="rightTop"></div>
      </login-top>
      <LoginText label="姓名" style="margin: 4vw 0" placeholder="请输入姓名" rule="^.{6,16}$" @inputChange="res=>{model.name=res}"></LoginText>
      <LoginText label="账号" placeholder="请输入账号" rule="^.{6,16}$" @inputChange="res=>{model.username=res}"></LoginText>
      <LoginText label="密码" placeholder="请输入密码" type="password" rule="^.{6,16}$" @inputChange="res=>{model.password=res}"></LoginText>
     <LoginBtn btntext="注册" @textClick="registerSubmit"></LoginBtn>
    </div>
</template>

<script>
  import LoginTop from "../components/common/LoginTop";
  import LoginText from "../components/common/LoginText";
  import LoginBtn from "../components/common/LoginBtn";
    export default {
      data(){
        return{
         model:{
           name:'',
           username:'',
           password:''
         }
        }
      },
      components: {LoginBtn, LoginText, LoginTop},
      methods:{
        //自定义事件监听的回调函数
        async registerSubmit(res){
          let rulg=/^.{6,16}$/
          if (rulg.test(this.model.name)&&rulg.test(this.model.username)&&rulg.test(this.model.password)){
            //发送请求
            const res=await this.$http.post('/register',this.model)
            this.$msg.fail(res.data.msg)
            localStorage.setItem('id',res.data.id)
            localStorage.setItem('token',res.data.objtoken)
            console.log(res)
            if(res.data.code == 200){
              console.log(2)
              this.$router.push('/userinfo')
            }
          }else {
            this.$msg.fail('格式不正确')
          }
        }
      }
    }
</script>

<style>

</style>
